@charset "utf-8";

@import "reset";

$font-size:40;

@function r($px){
    @return $px/$font-size*1rem;
}

html,body{
    width: 100%;
    height: 100%;
    position: relative;
}

.web{
    width: 100%;
    height: 100%;
    position: absolute;
    background: url('../img/wedding-bg.jpg')no-repeat;
    background-size:100% ;
}


.logo{
    width: r(296);
    height: r(41);
    margin: r(236) auto auto auto;
    img{
        width: 100%;
        height: 100%;
    }
    
}

.title{
    width: r(378);
    height: r(207);
     margin: r(36) auto auto auto;
    img{
        width: 100%;
        height: 100%;
    }
}

.btn{
    width: r(318);
    margin: 0 auto;
}

#dingzhi{
    display: inline-block;
    width: r(318);
    height: r(45);
     margin: r(90) auto 0 auto;
    img{
        width: 100%;
        height: 100%;
    }
}

#draw{
     display: inline-block;
    width: r(318);
    height: r(46);
    margin: r(30) auto 0 auto;
    img{
        width: 100%;
        height: 100%;
    }
}

.pop-up-windows{
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(123,2,7,.5);
    z-index: 99;
    display: none;
    .window-tc{
        width: r(413);
        height: r(250);
        background: url(../img/window-tc.png)no-repeat;
        position: absolute;
        background-size: 100%;
        left: r(115);
        top: r(356);
        .closeBtn{
            width: r(36);
            height: r(36);
            position: absolute;
            right: r(18);
            top: r(11);
            img{
                width: 100%;
                height: 100%;
            }
        }
        .tc-msg{
            width: r(164);
            height: r(86);
            position: absolute;
            left: r(123);
            top: r(42);
            img{
                width: 100%;
                height: 100%;
            }
        }
        #checkBtn{
            display: inline-block;
            width: r(195);
            height: r(37);
            background: #bf0c21;
            color: #e7c598;
            text-align: center;
            border-radius: r(10);
            position: absolute;
            left: r(109);
            bottom: r(50);
            font-size: r(22);
            line-height: r(37);
        }
    }
    
}

.rulemsg{
    width: r(533);
    height: r(810);
    position: absolute;
    left: r(57);
    top: r(40);
    img{
        width: 100%;
        height: 100%;
    }
}

#enterBtn{
    width: r(318);
    height: r(45);
    position: absolute;
    left: r(160);
    bottom: r(43);
    img{
        width: 100%;
        height: 100%;
    }
}

#backBtn{
    width: r(41);
    height: r(41);
    position: absolute;
    right: r(56);
    bottom: r(25);
    img{
        width: 100%;
        height: 100%;
    }
}
